// pages/post/post-comment/post-comment.js
import {
  DBPost
} from '../../../db/DBPost.js';

Page({

  /**
   * 页面的初始数据
   */
  data: {
    // 控制使用键盘还是发送语音
    useKeyboardFlag: true,
    // 控制input组件的初始值
    keyboardInputValue: '',
    // 控制是否显示图片选择面板
    sendMoreMsgFlag: false,
    // 保存已选择的图片
    chooseFiles: [],
    // 被删除的图片序号
    deleteIndex:-1
  
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function(options) {
    var postId = options.id;
    this.dbPost = new DBPost(postId);
    this.postData = this.dbPost.getPostItemById().data;
    var comments = this.dbPost.getCommentData();
    console.log(comments);
    this.setData({
      
      comments: comments
    })
  },

  // 图片预览
  previewImg: function(event) {
    //获取评论序号
    var commentIndex = event.currentTarget.dataset.commentIdx,
      //获取图片在图片数组中的序号
      imgIdx = event.currentTarget.dataset.imgIdx,
      imgs = this.data.comments[commentIndex].content.img;
    wx.previewImage({
      current: imgs[imgIdx],
      urls: imgs
    })

  },

  //按住说话和键盘输入的切换
  switchInputType: function(event) {
    this.setData({
      useKeyboardFlag: !this.data.useKeyboardFlag
    })
  },

  //获取用户输入
  bindCommentInput: function(event) {
    var val = event.detail.value;
    var pos = event.detail.cursor;
    //屏蔽关键字脏话 ‘他妈的’
    if (!pos != -1) {
      //光标在中间
      var left = event.detail.value.slice(0, pos);
      console.log(left);
      //计算光标位置
      pos = left.replace(/qq/g, '*').length;
    }
    this.data.keyboardInputValue = val;
    return val.replace(/他妈的/g, '*')
  },
  
  // 提交评论
  submitComment: function(event) {
    var imgs = this.data.chooseFiles;
    var newData = {
      username: "青石",
      avatar: "/images/avatar/avatar-3.png",
      create_time: new Date().getTime() / 1000,
      //评论内容
      content: {
        txt: this.data.keyboardInputValue,
        img: imgs
      }
    };
    if (!newData.content.txt && imgs.length === 0) {
      return;
    }

    //保存新评论到缓存数据库中
    this.dbPost.newComment(newData);
    //显示操作结果
    this.showCommitSuccessToast();
    //重新渲染并绑定所有评论
    this.bingCommentData();
    //恢复初识状态
    this.resetAllDefaultStatus();
  },

  // 评论成功
  showCommitSuccessToast: function() {
    wx.showToast({
      title: '评论成功',
      duration: 1000,
      icon: 'success'
    })
  },

  // 重新渲染界面
  bingCommentData: function() {
    var comments = this.dbPost.getCommentData();
    this.setData({
      comments: comments
    })
  },
  // 置空当前input框输入的内容
  resetAllDefaultStatus: function() {
    this.setData({
      keyboardInputValue: '',
      chooseFiles:[],
      sendMoreMsgFlag:false
    })
  },

  // 打开图片和拍照的控制面板
  sendMoreMsg: function(event) {
    this.setData({
      sendMoreMsgFlag: !this.data.sendMoreMsgFlag
    })
  },

  // 选择本地照片与拍照
  chooseImage: function(event) {
    // 已选择图片数组
    var imgArr = this.data.chooseFiles;
    //只能上传三张图片，包括拍照
    var leftCount = 3 - imgArr.length;
    if (leftCount <= 0) {
      return;
    }

    // 获取当前时选择本地照片还是拍照 注意 sourceType 是一个数组
    var sourceType = [event.currentTarget.dataset.category],
      that = this;

    wx.chooseImage({
      count: leftCount,
      sourceType: sourceType,
      success: function(res) {
        // 可以分次选择，但是总数不能超过三张
        console.log(res);
        that.setData({
          chooseFiles: imgArr.concat(res.tempFilePaths)
        })
      },
    })
  },

  deleteImage: function(event) {
    var index = event.currentTarget.dataset.idx,
      that = this;
      that.setData({
        deleteIndex:index
      })
      that.data.chooseFiles.splice(index,1);
      setTimeout(function(){
        that.setData({
          deleteIndex:-1,
          chooseFiles:that.data.chooseFiles
        })
      },500)

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function() {
    // 动态设置导航栏标题
    wx.setNavigationBarTitle({
      title: this.postData.title+"评论列表",
    })
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function() {

  }
})